<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>工时明细录入</title>
    <link rel="stylesheet" href="styles/detail.css">
    <link rel="stylesheet" href="styles/system.css">
    <link rel="stylesheet" href="styles/bootstrap/bootstrap.css">
    <link rel="stylesheet" href="styles/cy.css">
</head>

<body>
    <div class="wrap">
        <div class="detail1">
            <div class="detail1_top">
                <img src="images/detail_1.png" alt="">
                <h2>工时明细录入</h2>
            </div>
            <div>
                <div class="detail_search top-search">
                    <div class="row aline">
                        <div class="col-md-4 col-lg-4">
                            <div class="text-input displayflex">
                                <span class="">单据编号：</span>
                                <input class="flex1" type="text" placeholder="123">
                            </div>
                        </div>
                        <div class="col-md-4 col-lg-4">
                            <div class="text-input displayflex">
                                <span class="flexitem">填写日期:</span>
                                <input class="flex1" type="text" placeholder="2018-12-03" name="date" action="date">
                            </div>
                        </div>
                        <div class="col-md-4 col-lg-4">
                            <div class="text-input displayflex">
                                <span class="">所在部门：</span>
                                <input class="flex1" type="text" placeholder="公共产品部">
                            </div>
                        </div>
                        <div class="col-md-4 col-lg-4">
                            <div class="text-input displayflex">
                                <span class="">所属周：</span>
                                <select name="interest" class="flex1">
                                    <option value=""></option>
                                    <option value="0">0</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="detail2">
            <div class="detail2_top">
                <p>项目类</p>
            </div>
            <div class="detail2_table detail_auto">
                <table class="table">
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>项目编号</th>
                            <th>项目名称</th>
                            <th>周一</th>
                            <th>周二</th>
                            <th>周三</th>
                            <th>周四</th>
                            <th>周五</th>
                            <th>周六</th>
                            <th>周日</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>01</td>
                            <td>200102</td>
                            <td>天士力</td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>02</td>
                            <td>200102</td>
                            <td>德尔康</td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                            <td>
                                <div class="edit-input">
                                    <input type="text" value="4.5">
                                    <img src="images/bianji.png" alt="" data-toggle="modal" data-target="#myModal">
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>03</td>
                            <td>200102</td>
                            <td>四方云</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>04</td>
                            <td>200102</td>
                            <td>药链云</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>05</td>
                            <td>200102</td>
                            <td>药链云</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>06</td>
                            <td>200102</td>
                            <td>药链云</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="detail3">
            <div class="detail3_top">
                <p>非项目类</p>
                <a href="javascript:;" class="add">增加</a>
            </div>
            <div class="detail3_table detail_auto">
                <table class="table table02">
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>项目编号</th>
                            <th>项目名称</th>
                            <th>周一</th>
                            <th>周二</th>
                            <th>周三</th>
                            <th>周四</th>
                            <th>周五</th>
                            <th>周六</th>
                            <th>周日</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>01</td>
                            <td>200102</td>
                            <td>
                                <select name="" id="" class="select_1">
                                    <option value="会议">会议</option>
                                    <option value="培训">培训</option>
                                </select>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td>
                                <div class="btn-grout">
                                    <a href="javascript:;" class="del">删除</a>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>02</td>
                            <td>200102</td>
                            <td>
                                <select name="" id="" class="select_2">
                                    <option value="培训">培训</option>
                                    <option value="会议">会议</option>
                                </select>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td>
                                <div class="btn-grout">
                                    <a href="javascript:;" class="del">删除</a>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <!-- <div class="pageBox table-page clearfix">
                        <a href="">上一页</a>
                        <a href="">下一页</a>
                        <span>第<i>1</i>页</span>
                        <span>共<em>2</em>页</span>
        </div> -->
    </div>
    <div class="foot">
        Copyright © 2006-2015 深圳传世般若科技有限公司
    </div>

    <!-- 模态框（Modal） -->
    <div class="modal fade modalBox" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
        aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                </div>
                <div class="modal-body">
                    <textarea class="textdetail" name="" id="" cols="30" rows="10" placeholder="请填写工时明细..."></textarea>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary">保存</button>
                    <button type="button" class="btn btn-primary">提交</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>


    <script type="text/javascript" src="lib/jquery.min.js"></script>
    <script type="text/javascript" src="lib/bootstrap.min.js"></script>
    <script>
    // $(function(){
    //     $('.add').click(function() {
    //         $('.table02 tbody').prepend('<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>');
    //     })
    // })
    </script>
</body>

</html>